<template>
  <view class="normal-login-container">
	  <view class="imgUrl">
	    <img src="@/static/logo.jpg">
	  </view>
    <view class="login-form-content">
      	<view class="action-btn">
      	  <button 
		@click="handleLogin" 
	  	scope='userInfo' 
		class="login-btn cu-btn block bg-blue lg round"
		onError="onAuthError"
		>一键登录</button>
      	</view>
      	<view class="xieyi text-center">
      	  <text class="text-grey1">登录后尽享更多权益</text>
      	</view>
    </view>
     
  </view>
</template>

<script>
  import { getCodeImg } from '@/api/login'
  import { generateKey } from 'crypto'

  export default {
    data() {
      return {
        codeUrl: "",
        globalConfig: getApp().globalData.config,
        loginForm: {
          username: "admin",
          password: "admin123",
          code: "",
          uuid: ''
        }
      }
    },
    created() {
      
    },
    methods: {
      // 登录方法
      async handleLogin() {
		  this.scopeUserInfo()
      },
      // 密码登录
      async pwdLogin() {
        this.$store.dispatch('Login', this.loginForm).then(() => {
          this.$modal.closeLoading()
          this.loginSuccess()
        }).catch((res) => {
          this.$modal.loading("登录失败...")
		  let timer = setTimeout(()=>{
			  uni.hideLoading();
			  clearTimeout(timer); 
		  },3000);
        })
      },
      // 登录成功后，处理函数
      loginSuccess() {
		this.scopeUserInfo()
      },
	  scopeUserInfo() {
	    my.getAuthCode({
	      scopes: 'auth_user',
	      success: (res) => {
	        console.log('支付宝用户基础信息', res);
	        const authCode = res.authCode;
	        this.$store.dispatch('getAlipayToken', authCode)
	          .then(res => {
				  // this.$modal.closeLoading()
				  console.log(res)
	            this.$tab.reLaunch('/pages/index');
	          })
	          .catch((err) => {
	            console.log("登录失败" + err);
	          });
	      },
	      fail: (err) => {
	        console.log('调用失败:', err);
	      }
	    });
	  }
    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }
	// img标签样式
	.imgUrl img{
	    width: 180px;
	    height: 180px;
	    max-width: 100%;
	    max-height: 100%;
		display: block;
		margin: 40px auto;
	  }
  .normal-login-container {
    width: 100%;

    .logo-content {
      width: 100%;
      font-size: 21px;
      text-align: center;
      padding-top: 15%;

      image {
        border-radius: 4px;
      }

      .title {
        margin-left: 10px;
      }
    }

    .login-form-content {
      text-align: center;
      margin: 100px auto;
      margin-top:10%;
      width: 80%;

      .input-item {
        margin: 20px auto;
        background-color: #f5f6f7;
        height: 45px;
        border-radius: 20px;

        .icon {
          font-size: 38rpx;
          margin-left: 10px;
          color: #999;
        }

        .input {
          width: 100%;
          font-size: 14px;
          line-height: 20px;
          text-align: left;
          padding-left: 15px;
        }

      }

      .login-btn {
        margin-top: 40px;
        height: 45px;
		background-color: #0ba29b;
      }
      
      .reg {
        margin-top: 15px;
      }
      
      .xieyi {
        color: #ccc;
        margin-top: 20px;
      }
      
      .login-code {
        height: 38px;
        float: right;
      
        .login-code-img {
          height: 38px;
          position: absolute;
          margin-left: 10px;
          width: 200rpx;
        }
      }
    }
  }

</style>
